<template>
    <base-breadcrumb :title="$route.meta.title">
        <!-- 职工代表大会编辑 -->
        <a-form-model
            ref="ruleForm"
            :model="form"
            :label-col="{ span: 6 }"
            :wrapper-col="{ span: 18 }"
            :rules="editModel != 0 ? rules : {}"
        >
            <a-spin :spinning="loading">
                <!-- 表格 -->
                <a-card :bordered="false">
                    <title-name title="基本信息"></title-name>
                    <custom-form
                        :formList="formList"
                        :form="form"
                        @onSelectChange="onSelectChange"
                        :editModel="editModel == 0 ? '' : ''"
                    >
                    </custom-form>
                </a-card>
            </a-spin>
            <!-- 页脚操作栏 -->
            <div class="btn_box page-btn-right-top">
                <a-button
                    :loading="loading"
                    v-if="editModel != 0"
                    type="primary"
                    class="button_right"
                    @click="handleSubmit"
                    >提交</a-button
                >
                <a-button type="primary" @click="handleActiveClose">关闭</a-button>
            </div>
        </a-form-model>
    </base-breadcrumb>
</template>

<script>
import { getUnionBookHouse, updateUnionBookHouse, addUnionBookHouse } from '@/api/union/culturalActivities' // api
import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
import Selector from '@/components/Select/Selector'

import SelectJobUnit from '@/components/Select/SelectJobUnit'
import SelectCompanyAndProject from '@/components/Select/SelectCompanyAndProject'
import SelectOrgPeople from '@/components/Select/SelectOrgPeople'
export default {
    name:'a'+Date.now(),
    extends: new BaseEditPage(),
    components: {
    },
    data() {
        return {
            customRender: (q) => {
                let result = q.name
                if (q.postPNames && q.postPNames.length) {
                    result = `${result} (${q.postPNames.join('/')}) `
                }
                return result
            },
            loading: false, // 加载控件
            editModel: 0, // 操作状态:0 查看;1 编辑;2 新增
            form: {
                phone: '',
                chargePhone: '',
                jobPost: '',
            }, // 表单
            rules: {
                bookHouseName: [{ required: true, message: '请输入书屋名称', trigger: 'change' }],
                orgId: [{ required: true, message: '请选择单位', trigger: 'change' }],
                buildDate: [{ required: true, message: '请选择日期', trigger: 'change' }],
                bookLevel: [{ required: true, message: '请选择书屋等级', trigger: 'change' }],
                callNameDate: [{ required: true, message: '请选择日期', trigger: 'change' }],
                conferOrg: [{ required: true, message: '请输入颁发单位', trigger: 'change' }],
                houseArea: [{ required: true, message: '请输入面积', trigger: 'change' }],
                houseMoney: [{ required: true, message: '请输入投入金额', trigger: 'change' }],
                bookNum: [{ required: true, message: '请输入藏书量', trigger: 'change' }],
                address: [{ required: true, message: '请输入地址', trigger: 'change' }],
                adminId: [{ required: true, message: '请选择管理员', trigger: 'change' }],
                chargeId: [{ required: true, message: '请选择负责人', trigger: 'change' }],
                houseDevice: [{ required: true, message: '请输入书屋硬件设备', trigger: 'change' }],
            }, // 校验规则
            init: false, // 初始化控件
            formCode: '', // 形式选中项code
            subjectCode: '', // 获奖主体选中项code
            tagCodes: [],
        }
    },

    mounted() {
        this.$route.meta.title = ['职工书屋查看', '职工书屋编辑', '职工书屋新增'][this.editModel]
        let code = JSON.parse(sessionStorage.getItem('ycloud-user_info'))?.currentPost?.code

        if (this.editModel == 0) {
            this.tagCodes = ['CO', 'BC', 'PD']
        } else if (code == 'CO') {
            this.tagCodes = ['CO', 'BC']
        } else if (code == 'BC') {
            this.tagCodes = ['BC']
        }
        // 不为添加时请求详情
        if (this.editModel != 2) {
            this.loading = true
            getUnionBookHouse(this.id)
                .then((res) => {
                    this.loading = false
                    this.form = res.data

                    this.$nextTick(() => {
                        this.init = true
                    })
                })
                .catch(() => {
                    this.loading = false
                })
        } else {
            this.$nextTick(() => {
                this.init = true
            })
        }
    },
    computed: {
        formList() {
            return [
                {
                    keyName: 'bookHouseName',
                    type: 'BaseInput',
                    disabled: this.editModel == 0,
                    label: '书屋名称',
                },
                {
                    type: SelectJobUnit,
                    keyName: 'orgId',
                    disabled: this.editModel == 0,
                    label: '单位',
                    attrs: {
                        tagCodes: this.tagCodes,
                    },
                },

                {
                    keyName: 'buildDate',
                    type: 'a-date-picker',
                    placeholder: '请选择日期',
                    disabled: this.editModel == 0,
                    label: '建设时间',
                    attrs: {
                        valueFormat: 'YYYY-MM-DD',
                    },
                },
                {
                    keyName: 'bookLevel',
                    disabled: this.editModel == 0,
                    label: '书屋等级',
                    type: Selector,
                    attrs: {
                        selectType: '6',
                        urlType: 'union',
                    },
                },
                {
                    keyName: 'callNameDate',
                    type: 'a-date-picker',
                    placeholder: '请选择日期',
                    disabled: this.editModel == 0,
                    label: '命名挂牌时间',
                    attrs: {
                        valueFormat: 'YYYY-MM-DD',
                    },
                },
                {
                    keyName: 'conferOrg',
                    type: 'BaseInput',
                    disabled: this.editModel == 0,
                    label: '颁发单位',
                },
                {
                    keyName: 'houseArea',
                    type: 'BaseInputNumber',
                    disabled: this.editModel == 0,
                    label: '书屋面积(m²)',
                },
                {
                    keyName: 'houseMoney',
                    type: 'BaseInputNumber',
                    disabled: this.editModel == 0,
                    label: '投入金额(万元)',
                },
                {
                    keyName: 'bookNum',
                    type: 'BaseInputNumber',
                    disabled: this.editModel == 0,
                    label: '藏书量(册)',
                },
                {
                    keyName: 'address',
                    type: 'BaseInput',
                    disabled: this.editModel == 0,
                    label: '地址',
                },
                {
                    type: SelectOrgPeople,
                    keyName: 'adminId',
                    placeholder: '请选择管理员',
                    label: '管理员',
                    disabled: this.editModel == 0,
                    attrs: {
                        orgIds: [this.form.orgId],
                        isArray: true,
                        valueKey: 'adminId',
                        customRender: this.customRender,
                    },
                },
                {
                    keyName: 'phone',
                    type: 'BaseInput',

                    disabled: true,
                    label: '联系方式',
                },
                {
                    type: SelectOrgPeople,
                    keyName: 'chargeId',
                    placeholder: '请选择负责人',
                    label: '负责人',
                    disabled: this.editModel == 0,
                    attrs: {
                        orgIds: [this.form.orgId],
                        valueKey: 'chargeId',
                        isArray: true,
                        customRender: this.customRender,
                    },
                },
                {
                    keyName: 'jobPost',
                    type: 'BaseInput',
                    disabled: true,
                    label: '工作职务',
                },
                {
                    keyName: 'chargePhone',
                    type: 'BaseInput',
                    disabled: true,
                    label: '联系方式',
                },
                {
                    keyName: 'houseDevice',
                    type: 'BaseTextarea',
                    disabled: this.editModel == 0,
                    label: '书屋硬件设备',
                    span: 24,
                },
                {
                    keyName: 'remarks',
                    type: 'BaseTextarea',
                    label: '备注',
                    disabled: this.editModel == 0,
                    span: 24,
                },
            ]
        },
    },
    methods: {
        onSelectChange(name, e) {
            if (e?.key == 'adminId') {
                this.form.phone = e.phone
            }
            if (e?.key == 'chargeId') {
                this.form.chargePhone = e.phone
                this.form.jobPost = e.postPNames.toString()
                console.log(this.form)
            }
        },
        /**
         * 提交表单
         */
        handleSubmit() {
            let that = this
            let api = [updateUnionBookHouse, addUnionBookHouse][that.editModel - 1] // 根据操作切换url地址
            // 校验表单
            that.$refs.ruleForm.validate((e) => {
                if (e) {
                    // 提交表单
                    that.loading = true
                    let form = that.$clone(that.form)

                    api(form)
                        .then(() => {
                            that.loading = false
                            that.$message.success('提交成功！')
                            that.$multiTab.close()
                        })
                        .catch(() => {
                            that.loading = false
                        })
                }
            })
        },
    },
}
</script>

<style lang="less" scoped>
.file_prompt {
    color: #999;
}
</style>